
<!DOCTYPE html>
<html lang="zh">
<head>


  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7, IE=9" />

  <title>源辰影院_选座购票</title>
  <meta name="referrer" content="no-referrer">
  <link href="https://static.ydpcdn.cn/css/cdn_ydpstyle.css?201404291501" rel="stylesheet"/>


  <script src="https://unpkg.com/vue@2.7.14/dist/vue.min.js"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>

  <link rel="stylesheet" href="https://static.ydpcdn.cn/css/smoothness/jquery-ui-1.10.3.custom.min.css" media="screen" />
  <script src="https://static.ydpcdn.cn/scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
  <script src='https://static.ydpcdn.cn/scripts/jquery.unobtrusive-ajax.min.js' type='text/javascript'></script>

  <script src='https://static.ydpcdn.cn/scripts/jquery.validate.min.js' type='text/javascript'></script>
  <script src='https://static.ydpcdn.cn/scripts/jquery.validate.unobtrusive.min.js' type='text/javascript'></script>
  <script src='https://static.ydpcdn.cn/scripts/jquery-ui-1.10.3.custom.min.js' type='text/javascript'></script>

  <script src="https://static.ydpcdn.cn/scripts/cdn_ydp.js?201404291501"></script>



</head>
<body>
<div id="showFastDiv" style="display: none;">
</div>
<div class="wrapper">
  <!--顶部开始-->
  <div class="top" id="loginSection">
      <!--顶部开始-->
      <div class="top_box">
        <div class="top_one">
          看电影，来源辰影院！
        </div>
        <div id="app7">
          <template>
            <div>
              <div  v-if="!isLoggedIn" class="top_three">
                <a href="login.html" class="cRmain">登录</a><span class="cRddd"> 丨 </span><a
                      href="signup.html" class="cRmain">注册</a><span class="cRddd"> 丨 </span>
              </div>

              <div  v-else class="top_three">
                <p>
                  <span class="cRmain">{{ uname }}</span>欢迎来到源辰影院！
                  <a href="login.html" class="cRmain">[退出]</a> |
                  <a href="myorder.html" class="cRmain">[订单]</a><span class="cRddd">  </span>
                </p>
              </div>
            </div>
          </template>

          <script>

            var v = new Vue({
              el:"#app7",
              data() {
                return {
                  isLoggedIn: false,
                  uname: '',
                };
              },
              created() {
                let p = new URLSearchParams();
                axios.post("login?op=userinfo",p).then(res=>{
                  if (res.data.code == 200) {
                    this.isLoggedIn = true;
                    this.uname = res.data.uname;
                  }
                })
              },
            });
          </script>
        </div>
        </div>
      </div>
    </div>
    <!--快速登录-->
    <!--顶部 End-->
  </div>
  <!--顶部 End-->
  <!--头部开始-->
  <div class="header">
    <h1>源辰影院</h1>
    <div class="regionbox" style="z-index: 1;" id="regionSection">
    </div>
    <form action="/search" id="searchform" method="get">
      <div style="width: 361px; float: right; margin-top: 5px">
        <!--搜索开始-->
        <a href="search.html">搜索</a>
        <!--搜索 End-->
      </div>
    </form>
  </div>
  <!--头部 End-->
  <!--导航开始-->
  <div class="nav_box">
    <div class="nav">
      <ul id="defaultUL">
        <li><a href="index.html" title="首页">首页</a></li>
        <li><a href="movie.html" title="热映电影">热映电影</a></li>
        <li><a href="cinema.html" title="影厅">影厅</a></li>
      </ul>
    </div>
  </div>
  <!--导航 End-->
  <div id="body">
    <section class="content-wrapper main-content clear-fix">

      <!--选座购票步骤图-->
      <div class="center">
        <div class=" restop">
          <ul>
            <li>1.选择影片场次</li>
            <li class="cRwhite">2.填写手机号码</li>
            <li>3.确认订单并支付</li>
            <li>4.终端机取票</li>
          </ul>
        </div>
      </div>
      <!--内容框架-->
      <div class="center border">
        <div class="s_bd">
          <!--选定信息-->
          <div id="app">
            <template>
              <div>
                <div v-for="showtime in showtimes" :key="showtime.id" class="s_lnfo">
                  <div class="stpe1">
                    <img src="https://img1.doubanio.com/view/photo/s_ratio_poster/public/p2614988097.webp"
                         :width="60" :height="84" :alt="showtime.title">
                  </div>
                  <div class="stpe2">
                    <div class="ts"></div>
                    <p class="pb_m">
                      <span class="cRlgray">影片：</span><b><a href="movie1.html" target="_blank" :title="showtime.title">{{ showtime.mname }}</a></b>
                    </p>
                    <p class="pb_m">
                      <span class="cRlgray">影厅：</span>{{ showtime.hname }}
                    </p>
                    <p class="pb_m">
                      <span class="cRlgray">场次：</span><b class="fs14 cRmain">{{ showtime.date }} {{ showtime.starttime }}</b>
                    </p>
                  </div>
                  <div class="stpe3">
                    <p class="lh24">
                      <span class="cRlgray">票价：</span><b class="fs14 cRmain">{{ showtime.prize }}元</b>（含服务费）
                    </p>
                    <div id="changeshcdiv"></div>
                  </div>
                  <div class="stpe4">
                    <dl>
                      <dt>
                        <img src="https://pic.ydpcdn.cn/pictures/theater/2018-09/869244e1-6882-4e08-9d8b-d49247749b5a.png!150"
                             :width="105" :height="84">
                      </dt>
                      <dd><b class="fs14 lh24">源辰影院</b></dd>
                    </dl>
                  </div>
                </div>
              </div>
            </template>

          </div>

          <script>
            var v = new Vue({
              el:"#app",
              data() {
                return {
                  showtimes: [
                  ],
                };
              },
              created() {
                // 从数据库中获取数据
                this.fetchMovies();
              },
              methods: {
                fetchMovies() {
                  axios.post("movie?op=plan").then(res => {
                    this.showtimes = res.data;
                  })
                  // 使用适当的方法从数据库中获取电影数据，并将其赋值给movies数组
                  // 示例代码：
                  // 假设您已经从数据库中获取到了电影数据
                  // 可以根据从数据库中获取到的数据在这里添加更多电影对象
                },
              }
            });
          </script>
          <!--选定信息 End-->
          <!--选座区域-->
          <div class="seatingbg">
            <div class="seatingbox">


              <div class="s_live1">
              </div>
              <div class="s_live2">
              </div>
            </div>
            <!--选中座位区域-->

            <div id="divSelectedArea" class="selected">
              <div class="selt_c">
                <form action="/Orderpay/Order" id="seatForm" method="post"><input name="__RequestVerificationToken" type="hidden" value="" />

                  <div class="stpe6">
                    <div style="position: relative;">
                      <div class="telphone_show" style="display: none"></div>
                    </div>
                    <p class="cRlgray pb_m mt10 ">
                      <span style="font-size: 12px">接收取票码的手机号码：</span>
                    </p>

                    <div class="after">
                      <div class="lt">

                        <input class="seat_input" id="phone" maxlength="11" name="phone" type="text" value="" />
                        <span class="field-validation-valid" data-valmsg-for="phone" data-valmsg-replace="true"></span>
                      </div>
                      <div class="lt pb_l" id="submitdiv">
                        <a href="pay1.html" class="seat_indeed" onclick="submitSeats();"></a>
                      </div>
                    </div>
                  </div>
                </form>            </div>
            </div>
            <!--选座区域 End-->
            <div class="hg50">
            </div>
          </div>
        </div>
        <div class="hg10">
        </div>
        <!--内容结束-->
        <script type="text/javascript">
          var seatLimit = parseInt('6');
          var isLogin = 'False';
          String.prototype.splice = function (idx, rem, s) {
            return (this.slice(0, idx) + s + this.slice(idx + Math.abs(rem)));
          };


          function maskPhone(phone) {
            var masked = phone.toString();
            if (phone.length > 7) {
              masked = masked.splice(7, 0, "-");

            }

            if (phone.length > 3) {
              masked = masked.splice(3, 0, "-");
            }



            return masked;
          }

          $(function () {
            $("#phone").keyup(function (event) {

              $(".telphone_show").html(maskPhone($(this).val()));
              if ($(".telphone_show").html().length > 0) {
                $(".telphone_show").show();
              } else {
                $(".telphone_show").hide();
              }
            });
            $("#phone").on('input', function (event) {

              $(".telphone_show").html(maskPhone($(this).val()));
              if ($(".telphone_show").html().length > 0) {
                $(".telphone_show").show();
              } else {
                $(".telphone_show").hide();
              }
            });

            $("#phone").keypress(function (event) {
              if (event.keyCode == 13) {
                submitSeats();
                event.preventDefault();
              }
            });

            $("#phone").focusin(function (event) {
              if ($(".telphone_show").html().length > 0) {
                $(".telphone_show").show();
              }
            });
            $("#phone").focusout(function (event) {
              $(".telphone_show").hide();
            });


            $("#changebt").click(function (e) {
              showmoreschedule();
              e.stopPropagation();
            });
            if (isLogin == 'True') {
              $("#seatChart").load("/Seating/_SeatingChart/10273423", function () {
                $(document).on('click', "#seatChart ul li", clickonseat);
                $("#seatChart ul li").tooltip();
              });
            } else {
              $(document).on('click', "#seatChart ul li", FastLoGin);
            }

            $.validator.addMethod(
                    "regex",
                    function (value, element, regexp) {
                      var re = new RegExp(regexp);
                      return this.optional(element) || re.test(value);
                    },
                    "请输入正确的手机号码。"
            );

            $("#seatForm").validate();
            $("#phone").rules("add", {
              required: true
              , messages: { required: "请输入正确的手机号码。" }
            });
            $("#phone").rules("add", { regex: /^1\d{10}$|^(0\d{2,3}-?|\(0\d{2,3}\))?[1-9]\d{4,7}(-\d{1,8})?$/ })

            $(document).click(function (event) {
              if (!$(event.target).closest("#changeshcdiv").length) {
                if (!$("#changeshcdiv").is(":hidden")) {
                  $("#changeshcdiv").hide();
                  return;
                }
              }
            });


            $(document).on('click', "#changeshcdiv a", function (e) {
              var link = $(this).attr("href");
              if (link.indexOf('/') != -1) {
                e.stopPropagation();
                window.location.href(link);
              }
            });


          });



          function showmoreschedule() {
            if ($("#changeshcdiv").html().length < 5) {
              $("#changeshcdiv").load("/Seating/_ChangeSchedule?scheduleid=10273423", function () {
                $("#changeshcdiv").show();
                $(document).on('click', '#showall', function (e) {
                  if ($("#changeshcdiv .hide").first().is(":hidden")) {
                    $("#changeshcdiv .hide").show();
                    $(this).html("收起场次");

                  } else {
                    $("#changeshcdiv .hide").hide();
                    $(this).html("展开所有场次");
                  }
                  e.stopPropagation();
                });
              });
            } else {
              if ($("#changeshcdiv").is(":hidden")) {
                $("#changeshcdiv").show();
              } else {
                $("#changeshcdiv").hide();
              }
            }
          }



        </script>
  </div>
  <!--帮助 版权-->
  <div class="explain">
    <div class="explain_er">
      <dl>
        <dd>
          <p class="a1">
          </p>
          新手上路</dd>
        <ul>
          <li><a href="/help/register" title="会员注册">会员注册</a></li>
          <li><a href="/help/login" title="如何登录">如何登录</a></li>
          <li><a href="/help/process" title="快速购票">快速购票</a></li>
          <li><a href="/help/password" title="找回密码">找回密码</a></li>
        </ul>
      </dl>
      <dl>
        <dd>
          <p class="a2">
          </p>
          购票指南</dd>
        <ul>
          <li><a href="/help/process" title="购票流程">购票流程</a></li>
          <li><a href="/help/method" title="取票方法">取票方法</a></li>
          <li><a href="/help" title="支付方式">支付方式</a></li>
        </ul>
      </dl>
      <dl>
        <dd>
          <p class="a3">
          </p>
          常见问题</dd>
        <ul>
          <li><a href="/help" title="购票常见问题">购票常见问题</a></li>
          <li><a href="/help/recharge" title="会员充值问题">会员充值问题</a></li>
          <li><a href="/help/price" title="影片票价问题">影片票价问题</a></li>
          <li><a href="/help/coupon" title="优惠劵">优惠劵</a></li>
        </ul>
      </dl>
      <dl>
        <dd>
          <p class="a4">
          </p>
          关于我们</dd>
        <ul>
          <li><a href="/about">公司介绍</a></li>
          <li><a href="/sitemap">网站地图</a></li>
        </ul>
      </dl>
      <dl>
        <dd>
          <p class="a5">
          </p>
          客户服务</dd>
        <ul>
          <li><a href="#" class="bz">电话：400-677-8292</a></li>
          <li><a href="#" class="bz">邮箱：service@yidepiao.com</a></li>
        </ul>
      </dl>
    </div>
  </div>
</div>
</div>

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-35906595-1']);
  _gaq.push(['_addOrganic', 'm.baidu.com', 'word', true]);
  _gaq.push(['_addOrganic', 'image.baidu.com', 'word', true]);
  _gaq.push(['_addOrganic', 'baidu', 'word']);
  _gaq.push(['_addOrganic', 'soso', 'w']);
  _gaq.push(['_addOrganic', '3721', 'name']);
  _gaq.push(['_addOrganic', 'youdao', 'q']);
  _gaq.push(['_addOrganic', 'www.so.com', 'q']);
  _gaq.push(['_addOrganic', 'so.360.cn', 'q']);
  _gaq.push(['_addOrganic', 'vnet', 'kw']);
  _gaq.push(['_addOrganic', 'sogou', 'query']);
  _gaq.push(['_addOrganic', 'bing', 'q']);
  _gaq.push(['_trackPageview']);

  (function () {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
</body>
</html>
<!--YDP-SERVER-01 page createtime:2023/8/25 14:41:20-->